{extend name="addon/supply/supply/view/base.html"/}
{block name="resources"}
<style>
    .ns-card-common:first-of-type{margin-top: 0;}
    .layui-card-body{display: flex;justify-content: space-around;padding-bottom: 0 !important;padding-right: 50px !important;padding-left: 50px !important;flex-wrap: wrap;}
    .layui-card-body .content{width: 33.3%;display: flex;flex-direction: column;margin-bottom: 30px;justify-content: center;}
    .layui-card-body .money{font-size: 20px;color: #666;font-weight: bold;margin-top: 10px;max-width: 250px;}
    .layui-card-body .subhead{font-size: 12px;margin-left: 3px;cursor: pointer;}
</style>

{/block}
{block name='main'}
<div class="layui-card ns-card-common ns-card-brief">
    <div class="layui-card-header">
        <div>
            <span class="ns-card-title">账户概况</span>
        </div>
    </div>
    <div class="layui-card-body">
        <div class="content">
            <p class="title">供应商总收入(元)</p>
            <p class="money">{$total ?? 0}</p>
        </div>
        <div class="content">
            <p class="title">可用余额(元) <span class="subhead withdrawal ns-text-color">提现</span></p>
            <p class="money">{$account ?? 0}</p>
        </div>
        <div class="content">
            <p class="title">待结算(元) <span class="subhead order-record ns-text-color">查看明细</span></p>
            <p class="money">{$order_apply ?? 0}</p>
        </div>
        <div class="content">
            <p class="title">入驻费用(元)</p>
            <p class="money">{$supply_info.open_fee ?? 0}</p>
        </div>
        <div class="content">
            <p class="title">供应商保证金(元)</p>
            <p class="money">{$supply_info.bond ?? 0}</p>
        </div>
        <div class="content">
            <p class="title">已提现/提现中(元) <span class="subhead withdrawal-record ns-text-color">提现记录</span></p>
            <p class="money">{$account_withdraw ?? 0} / {$account_withdraw_apply ?? 0}</p>
        </div>
    </div>
</div>

<div class="layui-card ns-card-common ns-card-brief">
    <div class="layui-card-header">
        <div>
            <span class="ns-card-title">收支记录</span>
        </div>
    </div>
</div>

<!-- 筛选面板 -->
<div class="ns-single-filter-box">
    <div class="layui-form">
        <div class="layui-inline">
            <div class="layui-input-inline">
                <input type="text" name="start_time" id="start_time" placeholder="开始时间" class="layui-input" autocomplete="off" readonly>
                <i class="ns-calendar"></i>
            </div>
            <div class="layui-input-inline end-time">
                <input type="text" name="end_time" id="end_time" placeholder="结束时间" class="layui-input" autocomplete="off" readonly>
                <i class="ns-calendar"></i>
            </div>
            <button class="layui-btn layui-btn-primary" lay-submit lay-filter="search">搜索</button>
        </div>
    </div>
</div>

<div class="layui-tab ns-table-tab" lay-filter="goods_list_tab">
    <ul class="layui-tab-title">
        <li class="layui-this" data-status="">全部</li>
        <li data-status="1">收入</li>
        <li data-status="2">支出</li>
    </ul>
    <div class="layui-tab-content">
        <table id="account_list" lay-filter="account_list"></table>
    </div>
</div>

{/block}
{block name="script"}
<script type="text/html" id="account_data">
    {{#  if(d.account_data>0){ }}
    <span style="color: red; padding-right: 50px;">+{{d.account_data}}</span>
    {{#  } else if (d.account_data == 0){ }}
    <span style="padding-right: 50px;">{{d.account_data}}</span>
    {{#  } else { }}
    <span style="color: green; padding-right: 50px;">{{d.account_data}}</span>
    {{#  } }}
</script>

<script>
    var start_time,end_time,repeat_flag = false;

    layui.use(['element','laydate','laytpl','form'], function () {
        var element = layui.element,
            laydate = layui.laydate,
            laytpl = layui.laytpl,
            form = layui.form;
			
		form.render();
		
        //监听Tab切换，以改变地址hash值
        element.on('tab(goods_list_tab)', function () {
            table.reload({
                page: {
                    curr: 1
                },
                where: {
                    'type': this.getAttribute('data-status')
                }
            });
        });
        
        //开始时间
        laydate.render({
            elem: '#start_time' //指定元素
            ,done: function(value, date, endDate){
                start_time = ns.date_to_time(value);
            }
        });
        //结束时间
        laydate.render({
            elem: '#end_time' //指定元素
            ,done: function(value, date, endDate){
                end_time = ns.date_to_time(value);
            }
        });

        /**
         * 搜索功能
         */
        form.on('submit(search)', function (data) {
            data.field.start_time = start_time;
            data.field.end_time = end_time;
            table.reload({
                page: {
                    curr: 1
                },
                where: data.field
            });
            return false;
        });
        
        //提现
        $(".withdrawal").click(function (data) {

            laytpl($("#withdrawal").html()).render(data, function(html) {
                layer_pass = layer.open({
                    title: '提现',
                    skin: 'layer-tips-class',
                    type: 1,
                    area: ['600px'],
                    content: html,
                });
            });
        });

        //确认提现
        form.on('submit(withdrawal)', function(data) {
            if (repeat_flag) return false;
            repeat_flag = true;
            field = data.field;
            if(parseFloat(field.money) <= 0){
                layer.msg('您的可提现金额为0.00元，暂不能发起提现');
                repeat_flag = false;
                return;
            }
            if(parseFloat(field.apply_money) > parseFloat(field.money)){
                layer.msg('提现金额不能大于可提现金额');
                repeat_flag = false;
                return;
            }

            if(parseFloat(field.apply_money) < parseFloat(field.min_withdraw)){
                layer.msg('提现金额不能小于最低提现金额');
                repeat_flag = false;
                return;
            }
            if(parseFloat(field.apply_money) > parseFloat(field.max_withdraw)){
                layer.msg('提现金额不能大于最高提现金额');
                repeat_flag = false;
                return;
            }

            $.ajax({
                type: "POST",
                url: ns.url("supply://supply/supplywithdraw/apply"),
                data: {apply_money:field.apply_money},
                dataType: 'JSON',
                success: function(res) {
                    if (res.code == 0) {
                        layer.closeAll();
                        layer.msg('提现申请已经发出，可以进入提现记录查看', {
                            time: 3000 //2秒关闭（如果不配置，默认是3秒）
                        }, function(){
                            location.href = ns.url("supply://supply/account/dashboard");
                        });
                    }else{
                        layer.msg(res.message);
                    }
                }
            });
        });

    });

    var table = new Table({
        elem: '#account_list',
        url: ns.url("supply://supply/account/dashboard"),
        cols: [
            [{
                field: 'account_no',
                title: '账单编号',
                unresize: 'false',
                width:'16%'
            },{
                field: 'type_name',
                title: '收支来源',
                unresize: 'false',
                width:'14%'

            },{
                field: 'account_data',
                title: '<span style="padding-right: 50px;">金额（元）</span>',
                unresize: 'false',
                templet: '#account_data',
                width:'15%',
				align: 'right'
            }, {
                title: '收支类型',
                unresize: 'false',
                width:'8%',
                templet: function (res){
                    return res.account_data >= 0 ? "收入" : "支出";
                }

            }, {
                field: 'create_time',
                title: '时间',
                unresize: 'false',
                width:'17%',
                templet: function (res){
                    if(res.create_time == 0){
                        return '--';
                    }else{
                        return ns.time_to_date(res.create_time)
                    }

                }
            }, {
                title: '说明',
                unresize: 'false',
                width:'30%',
                templet: function (res){
                    return '<span title="'+res.remark+'">'+res.remark+'</span>';
                }

            }]
        ]
    });

    //提现记录
    $(".withdrawal-record").click(function () {
        location.href = ns.url("supply://supply/supplywithdraw/lists");
    });

    //交易记录
    $(".order-record").click(function () {
        location.href = ns.url("supply://supply/account/orderlist");
    });
    
    function closePass() {
        layer.close(layer_pass);
    }
</script>

<script type="text/html" id="withdrawal">
    <div class="layui-form" id="reset_pass" lay-filter="form">

        <div class="layui-form-item">
            <label class="layui-form-label">提现金额：</label>
            <div class="layui-input-block">
                <input type="number" name="apply_money" lay-verify="required" class="layui-input ns-len-mid" min="0">
            </div>
            <div class="ns-word-aux">
                <p>最低提现：￥{$withdraw_config.min_withdraw}； 最高提现：￥{$withdraw_config.max_withdraw} </p>
                <input type="hidden" name="min_withdraw" value="{$withdraw_config.min_withdraw}">
                <input type="hidden" name="max_withdraw" value="{$withdraw_config.max_withdraw}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">可提现金额：</label>
            <div class="layui-input-block">
                <p class="ns-input-text ">{$account}</p>
                <input type="hidden" name="money" value="{$account}">
            </div>
        </div>
        {if !empty($supply_cert_info)}
        {if condition="$supply_cert_info.bank_type == 1" }
        <div class="layui-form-item">
            <label class="layui-form-label">提现账户类型：</label>
            <div class="layui-input-block ">
                <p class="ns-input-text ">提现类型：银行卡</p>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">银行开户名：</label>
            <div class="layui-input-block ">
                <p class="ns-input-text ">{$supply_cert_info.settlement_bank_account_name}</p>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">银行账号：</label>
            <div class="layui-input-block ">
                <p class="ns-input-text ">{$supply_cert_info.settlement_bank_account_number}</p>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">开户银行支行名称：</label>
            <div class="layui-input-block ">
                <p class="ns-input-text ">{$supply_cert_info.settlement_bank_name}</p>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">开户银行所在地：</label>
            <div class="layui-input-block ">
                <p class="ns-input-text ">{$supply_cert_info.settlement_bank_address}</p>
            </div>
        </div>
        {elseif condition="$supply_cert_info.bank_type == 3" /}
        <div class="layui-form-item">
            <label class="layui-form-label">提现账户类型：</label>
            <div class="layui-input-block ">
                <p class="ns-input-text ">微信</p>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">微信昵称：</label>
            <div class="layui-input-block ">
                <p class="ns-input-text ">{$supply_cert_info.settlement_bank_address}</p>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">微信号：</label>
            <div class="layui-input-block ">
                <p class="ns-input-text ">{$supply_cert_info.settlement_bank_name}</p>
            </div>
        </div>
        {else /}
        <div class="layui-form-item">
            <label class="layui-form-label">提现账户类型：</label>
            <div class="layui-input-block ">
                <p class="ns-input-text ">支付宝</p>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">支付宝用户名：</label>
            <div class="layui-input-block ">
                <p class="ns-input-text ">{$supply_cert_info.settlement_bank_account_name}</p>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">支付宝账户：</label>
            <div class="layui-input-block ">
                <p class="ns-input-text ">{$supply_cert_info.settlement_bank_account_number}</p>
            </div>
        </div>
        {/if}
        {/if}
        <div class="ns-form-row">
            <button class="layui-btn ns-bg-color" lay-submit lay-filter="withdrawal">确定</button>
            <button class="layui-btn layui-btn-primary" onclick="closePass()">返回</button>
        </div>

        <input class="reset-pass-id" type="hidden" name="member_ids" value="{{d.member_id}}"/>
    </div>
</script>
{/block}